<!-- Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. -->
<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Fabric Samples Index</title>
	<link rel="stylesheet" href="../../../css/fabric.css">
	<link rel="stylesheet" href="../../../css/fabric.components.css">

  <style>
  html, 
  body {
      margin: 0;
      padding: 0;
  }    

  h1 {
      margin: 0;
      padding: 10px;
      margin-bottom: 20px;
      padding-left: 25px;
  }

  a {
    display: block;
    padding: 6px 0 6px 28px;
  }

  .LinkContainer {
    margin-bottom: 20px;
  }
  </style>
</head>
<body>

	<h1 class="ms-font-su ms-fontColor-white ms-bgColor-themeDarker">Components</h1>
    <div class="LinkContainer">
        <% components.forEach(function(component) { %>
            <a href="Components/<%= component %>/index.html" class="ms-Link ms-font-l ms-fontWeight-semilight ms-bgColor-neutralLighter--hover"><%= component %></a>
        <% }); %>
    </div>

	<h1 class="ms-font-su ms-fontColor-white ms-bgColor-themeDarker">Samples</h1>
    <div class="LinkContainer">
        <% samples.forEach(function(sample) { %>
            <a href="<%= sample %>/index.html" class="ms-Link ms-font-l ms-fontWeight-semilight ms-bgColor-neutralLighter--hover"><%= sample %></a>
        <% }); %>
    </div>

</body>
</html>